<template>
	<el-form :model="form" inline ref="form">
		<el-form-item label="所属事业部" prop="biz_id">
			<cl-select v-model="form.biz_id" filterable @change="changeBiz">
				<el-option
					v-for="item in business"
					:key="item.biz_id"
					:label="item.biz_name"
					:value="item.biz_id"
				/>
			</cl-select>
		</el-form-item>
		<el-form-item label="预约门店" prop="dept_id">
			<cl-shop-select v-model="form.dept_id" filterable :biz_id="form.biz_id" />
		</el-form-item>
		<el-form-item label="预约时间" prop="appoint_date">
			<cl-date-picker
				v-model="form.appoint_date"
				value-format="yyyy-MM-dd"
				style="width:150px"
				:clearable="false"
			/>
		</el-form-item>
		<el-form-item>
			<el-button type="primary" icon="el-icon-search" @click="search" :loading="loading">
				查找
			</el-button>
			<el-button plain @click="reset" :disabled="loading">重置</el-button>
		</el-form-item>
	</el-form>
</template>
<script>
import dayjs from "dayjs";
export default {
	props: {
		value: {
			type: Object,
			default: () => ({})
		},
		loading: Boolean
	},
	data() {
		return {
			form: {
				biz_id: "",
				dept_id: "", //所属
				appoint_date: dayjs().format("YYYY-MM-DD")
			}
		};
	},
	computed: {
		shopList() {
			const { biz_id } = this.form;
			return this.getBizRefData(biz_id, "shop_childs");
		}
	},
	watch: {
		value: {
			deep: true,
			immediate: true,
			handler(v) {
				this.form = { ...v };
			}
		}
	},
	methods: {
		async init() {
			await this.getShopList();
		},
		search() {
			this.change();
			this.$emit("search", this.form);
		},
		reset(refresh = true) {
			this.$refs.form.resetFields();
			const { biz_id } = this.form;
			let list = this.getBizRefData(biz_id, "shop_childs");
			this.form.dept_id = list[0]?.dept_id ?? "";
			this.change();
			if (!refresh) return;
			this.$emit("reset", this.form);
		},
		change() {
			this.$emit("input", this.form);
			this.$emit("change", this.form);
		},
		changeBiz() {
			this.form.dept_id = "";
			this.getShopList();
		},
		// 获取门店
		async getShopList() {
			const { biz_id } = this.form;
			await this.getBizRefShop(biz_id);
			let list = this.getBizRefData(biz_id, "shop_childs");
			this.form.dept_id = list[0]?.dept_id ?? "";
		}
	}
};
</script>
